import React, { useState, useEffect } from 'react';
import { Form, Space, Button } from 'antd';
import { goBack, componentsMap } from '@/utils/util';
import FileList from '@/components/FileLists';
import API from '@/api/xjindex.js';

const workDeploymentCheck_after = ({ history }) => {
  const [form] = Form.useForm();
  const [fileList, setFileList] = useState([]);
  const [disposeFileList, setDisposeFileList] = useState([]);
  const TableList = [
    {
      label: '工作名称',
      name: 'workName',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '紧急程度',
      name: '_emergency',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '接收单位',
      name: 'receiverName',
      type: 'input',
      otherProps: {
        disabled: true,
      },
      isremark: true,
    },
    {
      label: '工作说明',
      name: 'adress',
      type: 'textarea',
      otherProps: {
        disabled: true,
      },
      isremark: true,
    },
  ];
  const TableList1 = [
    {
      label: '处置单位',
      name: 'wo_receiverId',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '处置时间',
      name: 'wo_updateTime',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '处置人',
      name: 'wo_disUserName',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '处置说明',
      name: 'wo_adress',
      type: 'textarea',
      isremark: true,
      otherProps: {
        disabled: true,
      },
    },
  ];
  const receiverList = {};
  function initList() {
    const _JJCD = {};
    API.dictItemList().then((res) => {
      if (res) {
        res.t.map((item) => {
          if (item.dictCode == 'JJCD') {
            _JJCD[item.dictItemType] = item.dictItemName;
          }
        });
      }
    });
    API.showServiceProviderList()
      .then((res) => {
        if (res) {
          res.t.map((item) => {
            receiverList[item.id] = item.name;
          });
        }
      })
      .then(() => {
        const r = JSON.parse(history.location.query.xx);
        API.showWorkDanWei(r).then((res) => {
          if (res) {
            form.setFieldsValue({
              ...res.t,
              _emergency: _JJCD[res.t.emergency],
              wo_receiverId: receiverList[res.t.wo.receiverId],
              wo_updateTime: res.t.wo.updateTime,
              wo_disUserName: res.t.wo.disUserName,
              wo_adress: res.t.wo.adress,
            });
            setFileList(res.t.workFile);
            setDisposeFileList(res.t.workDisposeFile);
          }
        });
      });
  }
  useEffect(() => {
    initList();
  }, []);
  return (
    <div className="main-x">
      <Form form={form}>
        <div className="base-title">工作部署信息</div>
        <div className="ant-form-inline form-x bgf">
          {TableList.map((item) => {
            return (
              <Form.Item
                key={item.name}
                label={item.label}
                name={item.name}
                className={item.isremark ? 'block' : ''}
              >
                {componentsMap(item.type, item.otherProps, true)}
              </Form.Item>
            );
          })}
          <Form.Item label="附件信息" className="block">
            {<FileList fileList={fileList} downloadUrl="/work/download" />}
          </Form.Item>
        </div>
        <div className="base-title mt20">处置情况</div>
        <div className="ant-form-inline form-x bgf">
          {TableList1.map((item) => {
            return (
              <Form.Item
                key={item.name}
                label={item.label}
                name={item.name}
                className={item.isremark ? 'block' : ''}
              >
                {componentsMap(item.type, item.otherProps, true)}
              </Form.Item>
            );
          })}
          <Form.Item label="附件信息" className="block">
            {
              <FileList
                fileList={disposeFileList}
                downloadUrl="/work/download"
              />
            }
          </Form.Item>
        </div>
        <div className="footer-x">
          <Space size={18}>
            <Button type="primary" className="cancel-btn" onClick={goBack}>
              返回
            </Button>
          </Space>
        </div>
      </Form>
    </div>
  );
};

export default workDeploymentCheck_after;
